import LiliHeader from "../../components/header";
import LiliFooter from "../../components/footer";
import LiliGrid from "../../components/layout/LiliGrid";
import TransFormCarousel from "../../components/TransFormCarousel";
import { gameCarousel, gameGrid } from "../../utils/gameGrid";
import ChannelHeader from "../../components/channelHeader";
import ChannelLayout from "../../components/channelLayout";

function Game({ diff, loginAction }) {
  return (
    <div className="game">
      <LiliHeader loginAction={loginAction} />
      <div>
        <ChannelHeader title={"游戏"} />
        <ChannelLayout>
          <TransFormCarousel carouselImgs={gameCarousel} />
          <LiliGrid Grid={gameGrid} diff={diff} />
        </ChannelLayout>
        
      </div>
      <LiliFooter />
    </div>
  );
}

export default Game;